<template>
    <div id="app">
        <router-view/>
    </div>
</template>

<script>
export default {
    name: "App",
    created(){
        var os = function (){
            var ua = navigator.userAgent,
                isWindowsPhone = /(?:Windows Phone)/.test(ua),
                isSymbian = /(?:SymbianOS)/.test(ua) || isWindowsPhone,
                isAndroid = /(?:Android)/.test(ua),
                isFireFox = /(?:Firefox)/.test(ua),
                isChrome = /(?:Chrome|CriOS)/.test(ua),
                isTablet = /(?:iPad|PlayBook)/.test(ua) || (isAndroid && !/(?:Mobile)/.test(ua)) || (isFireFox && /(?:Tablet)/.test(ua)),
                isPhone = /(?:iPhone)/.test(ua) && !isTablet,
                isPc = !isPhone && !isAndroid && !isSymbian;

            return {
                isTablet: isTablet,
                isPhone: isPhone,
                isAndroid: isAndroid,
                isPc: isPc
            };
        }();

        if (os.isAndroid || os.isPhone) {
            this.$store.commit('SET_SYSINFO', {
                deviceType: 'mobile'
            });
        }else if(os.isTablet){
            this.$store.commit('SET_SYSINFO', {
                deviceType: 'pad'
            });
        }else{
            this.$store.commit('SET_SYSINFO', {
                deviceType: 'pc'
            });
        }

    },
};
</script>

<style lang="less">
  html,
  body {
    height: 100%;
    overflow: hidden;
  }
  #app {
    font-family: "Avenir", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 100%;
    color: #000;
    background-color: #f0f2f5;
    font-size: 14px;
    line-height: 1;
    overflow: hidden;
  }
  .ellipsis {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .clearfix {
    &::after {
      content: "";
      display: table;
      clear: both;
    }
  }
</style>
<style lang="less">
  .el-table td,
  .el-table th {
    padding: 8px 0 !important;
  }
  .el-table th.is-leaf{
    color: rgba(0,0,0);
    font-weight: bold;
    border-bottom: 0 !important;
  }
  .el-table {
    .el-table__header {
      .cell {
        font-weight: bold;
      }
    }
  }
  .no-padding {
    .el-card__body {
      padding: 0;
    }
  }
</style>
